<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
	response.setHeader("Access-Control-Allow-Origin", "*");
%>
<!DOCTYPE html>
<html>
<style>
#name {
	color: black;
	font-size: 30px;
	font-weight: 100;
}

.name {
	width: 260px;
	font-weight: 700;
}

.value {
	width: calc(100% - 260px);
}

.a-row {
	border-bottom: 1px dotted #abb2bf;
	display: flex;
	padding: 10px 0;
	margin: 0 0 0 10px;
	font-size: 14px;
}

.ibox-content h2 {
	background: #1AB394;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.5rem;
	font-weight: 400;
	margin: 0 0 5px 0;
	padding: .6rem;
}
</style>
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>药品·数据工厂</title>
<link href="${pageContext.request.contextPath }/img/webLogoIcon.png"
	rel="shortcut icon">
<link href="${pageContext.request.contextPath }/css/bootstrap.min.css"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath }/font-awesome/css/font-awesome.css"
	rel="stylesheet">

<!-- Toastr style -->
<link
	href="${pageContext.request.contextPath }/css/plugins/toastr/toastr.min.css"
	rel="stylesheet">

<link href="${pageContext.request.contextPath }/css/animate.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/style.css"
	rel="stylesheet">



</head>

<body>

	<div id="wrapper">
		<nav class="navbar-default navbar-static-side" role="navigation">
			<%
				request.setAttribute("LEFT", "medicine");
			%>
			<%@include file="../components/left.jsp"%>
		</nav>


		<div id="page-wrapper" class="gray-bg">
			<div class="row border-bottom f-0">
				<jsp:include page="../components/head.jsp" flush="true" />
			</div>
			<div class="row wrapper border-bottom white-bg page-heading"
				style="margin-top: 20px">
				<div class="col-lg-10">
					<h2>药品</h2>
					<ol class="breadcrumb">
						<li><a href="index.html">首页</a></li>
						<li><a>${webName }</a></li>
						<li class="active"><strong>详情</strong></li>
					</ol>
				</div>
			</div>

			<div class="wrapper wrapper-content  animated fadeInRight article">
				<div class="row">

					<div class="col-lg-12 col-lg-offset" style="padding-right: 20px">
						<div class="ibox">
							<div class="ibox-content" id="list">
								<!-- <h1 id="name">Ornithine aspartate</h1>
								<div id="identification">
									<h2>Identification</h2>
									<div class="a-row">
										<div class="name">Name</div>
										<div class="value">
											<a>Ornithine aspartate</a>
										</div>
									</div>
									<div class="a-row">
										<div class="name">Accession Number</div>
										<div class="value">DBSALT002898&nbsp; (DB15577)</div>
									</div>
									<div class="a-row">
										<div class="name">Structure</div>
										<div class="value">
											<img
												src="https://www.drugbank.ca/structures/DBSALT002898/thumb.svg">
										</div>
									</div>
									<div class="a-row">
										<div class="name">Chemical Formula</div>
										<div class="value">
											C <sub>9</sub>H <sub>19</sub>N <sub>3</sub>O <sub>6</sub>
										</div>
									</div>
									<div class="a-row">
										<div class="name">Synonyms</div>
										<div class="value"></div>
									</div>
									<div class="a-row">
										<div class="name">UNII</div>
										<div class="value">
											<a target="_blank"
												href="http://fdasis.nlm.nih.gov/srs/srsdirect.jsp?regno=JA08T3B97O">JA08T3B97O</a>
										</div>
									</div>
									<div class="a-row">
										<div class="name">Inchi</div>
										<div class="value">InChI=1S/C5H12N2O2.C4H7NO4/c6-3-1-2-4(7)5(8)9;5-2(4(8)9)1-3(6)7/h4H,1-3,6-7H2,(H,8,9);2H,1,5H2,(H,6,7)(H,8,9)/t4-;2-/m00/s1</div>
									</div>
									<div class="a-row">
										<div class="name">Inchi Key</div>
										<div class="value">IXUZXIMQZIMPSQ-ZBRNBAAYSA-N</div>
									</div>
									<div class="a-row">
										<div class="name">Smiles</div>
										<div class="value" style="word-break: break-word;">N[C@@H](CCC[NH3+])C(O)=O.N[C@@H](CC(O)=O)C([O-])=O</div>
									</div>
									<div class="a-row">
										<div class="name">Weight</div>
										<div class="value">
											Average: 265.266 <br>Monoisotopic: 265.127385344
										</div>
									</div>
									<div class="a-row">
										<div class="name">Drug Entry</div>
										<div class="value">
											<a target="_blank"
												href="https://www.drugbank.ca/drugs/DB00129">Ornithine
												See full entry for Ornithine</a>
										</div>
									</div>
								</div> -->
							</div>


						</div>

					</div>

				</div>


			</div>


		</div>

	</div>



	<!-- Mainly scripts -->
	<script src="${pageContext.request.contextPath }/js/jquery-2.1.1.js"></script>
	<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/plugins/metisMenu/jquery.metisMenu.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>

	<!-- Custom and plugin javascript -->
	<script src="${pageContext.request.contextPath }/js/inspinia.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/plugins/pace/pace.min.js"></script>
	<script src="${pageContext.request.contextPath }/js/userCustom.js"></script>
	<script type="text/javascript">
		var pmid='${pmid}';
		detail();
		function detail() {
			$
					.ajax({
						url : "${pageContext.request.contextPath}/organChip/getmedicineDetail",
						type : "post",
						data : {
							pmid : pmid
						},
						success : function(res1) {
							console.log(res1);
							let res=JSON.parse(res1);
							let search=JSON.parse(res.unii);
							let surl=search.url;
							let uniiname=search.name;
							let drug_entry=JSON.parse(res.drug_entry);
							var html='';
							html+='<h1 id="name">'+res.name+'</h1>'+
								'<div id="identification">'+
							'<h2>Identification</h2>'+
							'<div class="a-row">'+
								'<div class="name">Name</div>'+
								'<div class="value">'+
									'<a>'+res.name+'</a>'+
								'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Accession Number</div>'+
								'<div class="value">'+res.accession_number+'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Structure</div>'+
								'<div class="value">'+
									'<img src="'+res.structure+'">'+
								'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Chemical Formula</div>'+
								'<div class="value">'+res.chemical_formula+'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Synonyms</div>'+
								'<div class="value"></div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">UNII</div>'+
								'<div class="value">'+
									'<a target="_blank" href="'+surl+'">'+uniiname+'</a>'+
								'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Inchi</div>'+
								'<div class="value">'+res.inchi+'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Inchi Key</div>'+
								'<div class="value">'+res.inchi_key+'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Smiles</div>'+
								'<div class="value" style="word-break: break-word;">'+res.smiles+'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Weight</div>'+
								'<div class="value">'+
									res.weight+
								'</div>'+
							'</div>'+
							'<div class="a-row">'+
								'<div class="name">Drug Entry</div>'+
								'<div class="value">'+
									'<a target="_blank" href="'+drug_entry.url+'">'+drug_entry.name+'</a>'+
								'</div>'+
							'</div>'+
						'</div>'
							$('#list').html(html);
						},

						error : function(err) {
							console.log(err)
						}
					});
		}
	</script>

	<script>
		var navlist = '<li><a class="nav2active" href="#">工商信息</a></li>'
				+ '<li><a href="#">投资融资</a></li>'
				+ '<li><a href="#">高新企业</a></li>'
		$("#nav3list").append(navlist)
	</script>
</body>

</html>


</body>
</html>